<template>
    <div>
        <el-dialog :title="taskForm.title" :visible.sync="dialogFormVisible" width="80%">
            <el-form :model="taskForm">
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="id">
                            <el-input v-model="taskForm.id" autocomplete="off" style="width: 60%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="日期id">
                            <el-input v-model="taskForm.workDateId" autocomplete="off" style="width: 60%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="项目编号id">
                            <el-select v-model="taskForm.customId" placeholder="请选择" :disabled="taskForm.title === '查看任务信息'">
                                <el-option v-for="item in customData"
                                           :key="item.id"
                                           :label="item.customName"
                                           :value="item.id">
                                    <span style="float: left">{{ item.customName }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.customCode }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="子模块id">
                            <el-select v-model="taskForm.projectId" placeholder="请选择" :disabled="taskForm.title === '查看任务信息'">
                                <el-option v-for="item in projectData"
                                           :key="item.id"
                                           :label="item.name"
                                           :value="item.id">
                                    <span style="float: left">{{ item.name }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.code }}</span>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="任务名称">
                            <el-input v-model="taskForm.taskName" autocomplete="off" style="width: 75%" :disabled="taskForm.title === '查看任务信息'" placeholder="请输入"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="任务状态">
                            <el-select v-model="taskForm.taskStatus" placeholder="请选择" :disabled="taskForm.title === '查看任务信息'">
                                <el-option v-for="item in taskStatusItems"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="任务类型">
                            <el-select v-model="taskForm.taskType" placeholder="请选择" :disabled="taskForm.title === '查看任务信息'">
                                <el-option v-for="item in taskTypeItems"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="备注">
                            <el-input v-model="taskForm.taskComment" autocomplete="off" style="width: 90%" type="textarea"
                                      :rows="2" :disabled="taskForm.title === '查看任务信息'" placeholder="请输入"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="任务优先级">
                            <el-select v-model="taskForm.taskPriority" placeholder="请选择" :disabled="taskForm.title === '查看任务信息'">
                                <el-option v-for="item in taskTypeItems"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="创建时间">
                            <el-input v-model="taskForm.creatTime" autocomplete="off" style="width: 75%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="项目用时">
                            <el-input v-model="taskForm.time" autocomplete="off" style="width: 75%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="开始时间">
                            <el-input v-model="taskForm.startTime" autocomplete="off" style="width: 75%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="完成时间">
                            <el-input v-model="taskForm.endTime" autocomplete="off" style="width: 75%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="片段时间">
                            <el-input v-model="taskForm.partStartTime" autocomplete="off" style="width: 75%" :disabled="true" placeholder="自动生成"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="save()">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
  import {apiDefaultErrorHandler} from "../../../api/base";
  import workTaskApi from "../../../api/work/workTask";
  import workCustomApi from "../../../api/work/workCustom";
  import workProjectApi from "../../../api/work/workProject";

  export default {
    name: "date",
    props: {
      taskForm: {
        title: '',
        id: '',
        workDateId: '',
        customId: '',
        projectId: '',
        taskName: '',
        taskComment: '',
        taskStatus: '',
        taskType: '',
        taskPriority: '',
        creatTime: '',
        time: '',
        startTime: '',
        endTime: '',
        partStartTime: ''
      },
    },
    data() {
      return {
        dialogFormVisible: false,
        projectData: [],
        customData: [],
        taskStatusItems: [{
          value: 0,
          label: '计划中'
        }, {
          value: 1,
          label: '进行中'
        }, {
          value: 2,
          label: '暂停中'
        }, {
          value: 3,
          label: '已完成'
        }],
        taskTypeItems: [{
          value: 0,
          label: '项目工作'
        }, {
          value: 1,
          label: '临时事项'
        }, {
          value: 2,
          label: '明日计划事项'
        }],
        taskPriorityItems: [{
          value: 0,
          label: '一般'
        }, {
          value: 1,
          label: '尽快完成'
        }, {
          value: 2,
          label: '非常紧急'
        }],
      }
    },
    mounted() {
      this.queryProjectInfo()
      this.queryCustomInfo()
    },
    methods: {
      showDialog() {
        this.dialogFormVisible = true
      },
      // 保存数据
      save() {
        workTaskApi.save(this.taskForm).then(({ data }) => {
          if (this.$http.isResponseSuccess(data)) {
            this.$message('保存成功!!');
            this.dialogFormVisible = false
            // 触发父组件的children事件，将this.form回传过去
            this.$emit('children')
          } else {
            apiDefaultErrorHandler(data)
          }
        }).catch((ex) => {
          apiDefaultErrorHandler(ex)
        })
      },
      // 查询所有项目信息
      queryProjectInfo() {
        workProjectApi.queryAll().then(({data}) => {
          if (this.$http.isResponseSuccess(data)) {
            this.projectData = data.list
          } else {
            apiDefaultErrorHandler(data)
          }
        }).catch((ex) => {
          apiDefaultErrorHandler(ex)
        });
      },
      // 查询所有客户信息
      queryCustomInfo() {
        workCustomApi.queryAll().then(({data}) => {
          if (this.$http.isResponseSuccess(data)) {
            this.customData = data.list
          } else {
            apiDefaultErrorHandler(data)
          }
        }).catch((ex) => {
          apiDefaultErrorHandler(ex)
        });
      },
    }
  }
</script>

<style>
</style>